<template>
  <view class="c2bConfirm">
    <view class="container">
  		<view class="close_btn" @click.stop="handleCloseC2bConfirm">
  			<image src="https://100000063-1252208446.file.myqcloud.com/images/macallan-remvp/X.png"></image>
  		</view>
  		<image class="top_img" src="https://100000063-1252208446.file.myqcloud.com/images/macallan-remvp/cart/Dividersx.png"></image>
      <view class="main_text">该订单含个性化定制商品</view>
  		<view class="main_text">订单提交后不予退换货</view>
  		<view class="main_text">若含多件商品默认享受相同定制服务</view>
      <view class="checkBtnBox" @click.stop="handleSubmitOrder">
        确认提交订单
      </view>
    </view>
  </view>
</template>

<script>
  export default {
    data() {
      return {

      }
    },
    props: {

    },
    methods: {
			handleCloseC2bConfirm(){
				this.$emit('onC2bConfirmClick',"CLOSE");
			},
			handleSubmitOrder(){
				this.$emit('onC2bConfirmClick',"SUBMIT_ORDER");
			},
			handleLookC2bRules(){
				this.$emit('onC2bConfirmClick',"C2B_RULES");
			}
    }
  }
</script>

<style lang="scss">
  .c2bConfirm {
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 10;

    .container {
			display: flex;
			justify-content: flex-end;
			align-items: center;
			flex-direction: column;
      position: absolute;
      top: 50%;
			margin-top: -302rpx;
      width: 654rpx;
      height: 604rpx;
      background: #fff;
      left: 48rpx;
			padding-bottom: 96rpx;
			.close_btn{
				position: absolute;
				top: 24rpx;
				right: 24rpx;
				width: 64rpx;
				height: 64rpx;
				image{
					width: 40%;
					height: 40%;
					margin: 30%;
				}
			}
			.top_img{
				width: 182rpx;
				height: 56rpx;
				margin-bottom: 20rpx;
			}

      .main_text {
        text-align: center;
        font-size: 28rpx;
        line-height: 48rpx;
				font-family: NotoSansSC-Regular;
      }
			.tips_text{
				margin-top: 80rpx;
				color: #757575;
				font-size: 24rpx;
				font-family: FrankNew-Regular,NotoSansSC-Regular;
				line-height: 40rpx;
				padding: 0 72rpx;
				.tips_btn{
					color: #000 !important;
					padding-bottom: 6rpx;
					border-bottom: 1px solid #000 !important;
				}
			}
      .checkBtnBox {
				margin-top: 80rpx;
				width: 526rpx;
				height: 80rpx;
				line-height: 80rpx;
				border-radius: 48rpx 16rpx 48rpx 48rpx;
				background: #000;
				color: #fff;
				font-family: NotoSansSC-Medium;
				font-size: 28rpx;
				text-align: center;
      }
    }
  }
</style>
